<div class="questionnaire-questions">
  <div class="row column text-center">
    <button type="button" class="button button__sm button__secondary collapse-all"><%= t("collapse", scope: "decidim.forms.admin.questionnaires.form") %></button>
    <button type="button" class="button button__sm button__secondary expand-all"><%= t("expand", scope: "decidim.forms.admin.questionnaires.form") %></button>
  </div>

  <% announcement_body = capture do %>
    <ul>
      <% t("announcement_html", admin_link: Decidim::EngineRouter.main_proxy(meeting.component).admin_meeting_polls_responses_path(meeting), scope: "decidim.meetings.admin.poll.form").each do |item| %>
        <li> <%= item %></li>
      <% end %>
    </ul>
  <% end %>
  <%= cell("decidim/announcement", { body: announcement_body }, callout_class: "info") %>

  <%= fields_for "questionnaire[questions][#{blank_question.to_param}]", blank_question do |question_form| %>
    <script type="text/template" class="decidim-question-template decidim-template" id="question-template">
      <%= render "decidim/meetings/admin/poll/question",
                 form: question_form,
                 id: tabs_id_for_question(blank_question),
                 editable: true,
                 response_option_template_selector: "#response-option-template-dummy" %>
    </script>
    <%= render "decidim/meetings/admin/poll/response_option_template", form: question_form, editable: true, template_id: "response-option-template-dummy" %>
  <% end %>

  <div class="questionnaire-questions-list flex flex-col py-6 gap-6 last:pb-0" data-draggable-table data-sort-url="#" data-draggable-handle=".card-divider" id="questionnaire-questions-list">
    <% @form.questions.each_with_index do |question, index| %>
      <%= fields_for "questionnaire[questions][]", question do |question_form| %>
        <%= render "decidim/meetings/admin/poll/question",
                   form: question_form,
                   id: tabs_id_for_question(question),
                   editable: question.editable?,
                   response_option_template_selector: "#response-option-template-#{index}" %>
        <%= render "decidim/meetings/admin/poll/response_option_template", form: question_form, editable: question.editable?, template_id: "response-option-template-#{index}" %>
      <% end %>
    <% end %>
  </div>

  <button class="button button__sm button__secondary add-question"><%= t("add_question", scope: "decidim.forms.admin.questionnaires.form") %></button>
</div>

<%= append_javascript_pack_tag "decidim_forms_admin" %>

<script>
  document.addEventListener("turbo:load", function () {
    window.Decidim.createEditableForm();
  });
</script>
